<!--<!DOCTYPE html>-->
<html lang="en" dir="ltr">
    <head>
        <meta charset="UTF-8">
        <title>用户登录</title>
        <link rel="stylesheet" href="css/login.css">
        <!--    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" charset="utf-8"></script>-->
        <script src="js/jquery-3.3.1.min.js" charset="UTF-8"></script>

        <script>

            $(function () {
                //1.给登录按钮绑定单击事件
                $("#btn_sub").click(function () {
                    //2.发送ajax请求，提交表单数据
                    $.post("user/login",$("#loginForm").serialize(),function (data) {//参考这里写访问详情页面
                        //data : {flag:false,errorMsg:''}
                        if(data.flag){
                            //登录成功
                            location.href="index.html?gname=";
                        }else{
                            //登录失败
                            $("#errorMsg").html(data.errorMsg);
                        }
                    });
                });
            });


            //3.处理响应结果

        </script>
    </head>
    <body>

        <form action="" class="login-form" accept-charset="utf-8" method="get" id="loginForm">
            <!--登录错误提示消息-->
            <div id="errorMsg" class="alert-danger"></div>
                <h1>登录</h1>

                <input type="hidden" name="action" value="login"/>
                <div class="txtb">
                    <input type="text" name="username" autocomplete="off">
                    <span data-placeholder="Username"></span>
                </div>

                <div class="txtb">
                    <input type="password" name="password" autocomplete="off">
                    <span data-placeholder="Password"></span>
                </div>

                <input type="button" id="btn_sub" class="logbtn" value="登录">

                <div class="button-text">
                    没有账号？<a href="regist.html"> 注册 </a>
                </div>

            </form>

            <script type="text/javascript">
                $(".txtb input").on("focus", function () {
                    $(this).addClass("focus");
                });

                $(".txtb input").on("blur", function () {
                    if ($(this).val() == "")
                        $(this).removeClass("focus");
                });
            </script>


    </body>
</html>